Ext.namespace("ca.magex.gps");

ca.magex.gps.TrackpointMapPanel = function(config) {
	
	var t = this;
	
	Ext.apply(this, config);
	
    ca.magex.gps.TrackpointMapPanel.superclass.constructor.call(this, {
    });

	this.on('render', function(comp) {
		t.mapEl = Ext.DomHelper.append(comp.body.dom, { tag: 'div', style: 'height: 1680px; width: 1050px;'});
		t.gmap = new GMap2(t.mapEl);
		t.gmap.addControl(new GLargeMapControl());
		t.gmap.addControl(new GMapTypeControl());
		t.gmap.addMapType(G_PHYSICAL_MAP);
		t.gmap.setMapType(G_PHYSICAL_MAP);
	});
	
	this.on('resize', function(comp, adjWidth, adjHeight, rawWidth, rawHeight) {
		t.mapEl.style.height = (adjHeight - 27) + "px";
		t.mapEl.style.width = (adjWidth - 2) + "px";
		t.gmap.checkResize();
	});

	var drawPath = function(o) {
		if (!t.gmap)
			return;
		var doc = o.responseXML;

		t.gmap.clearOverlays();
		
		var points = doc.getElementsByTagName("Point");
		var geopoints = new Array;
		for (var i = 0; i < points.length; i++) {
			var point = points[i];
			geopoints.push(new GLatLng(point.getAttribute("lat"), point.getAttribute("lon")));
		}
		
		var polyline = new GPolyline(geopoints, "#ff0000", 5);
		var center = doc.getElementsByTagName("Center")[0];
		var zoom = t.gmap.getBoundsZoomLevel(polyline.getBounds());
		
		t.gmap.setCenter(new GLatLng(center.getAttribute("lat"), center.getAttribute("lon")), zoom);
		t.gmap.addOverlay(polyline);
	}

	this.load = function(query, end) {
		Ext.Ajax.request({
			url: 'php/gpsquery.php',
			method: 'post',
			success: drawPath,
			params: {
				q: query,
				l: 1000
			}
		});
	}

};

Ext.extend(ca.magex.gps.TrackpointMapPanel, Ext.Panel);
